/**
 * 初始化祝福墙功能
 */
document.addEventListener('DOMContentLoaded', () => {
    const wishesWall = document.querySelector('.wishes-wall');
    const submitBtn = document.getElementById('submitWish');
    const nameInput = document.getElementById('name');
    const messageInput = document.getElementById('message');

    // 预设的祝福数据
    const initialWishes = [
        // { name: "小明", message: "祝你生日快乐！永远开心！", time: "2024-03-21" },
        // { name: "小红", message: "愿你天天开心，事事顺心！", time: "2024-03-21" },
        // { name: "小华", message: "生日快乐！愿你梦想成真！", time: "2024-03-21" },
        // { name: "小李", message: "祝愿你前程似锦！", time: "2024-03-21" },
        // { name: "小张", message: "愿你的生活如彩虹般绚丽！", time: "2024-03-21" }
    ];

    // 获取所有祝福数据（包括预设和用户添加的）
    let allWishes = JSON.parse(localStorage.getItem('wishes')) || initialWishes;

    /**
     * 添加新祝福到墙上
     */
    function addWishToWall(name, message, time = new Date().toLocaleDateString(), shouldSave = true) {
        const wishItem = document.createElement('div');
        wishItem.className = 'wish-item';
        wishItem.innerHTML = `
            <span class="wish-name">${name}</span>
            <p class="wish-text">${message}</p>
            <span class="wish-time">${time}</span>
        `;
        
        // 添加渐入动画
        wishItem.style.opacity = '0';
        wishItem.style.transform = 'translateY(20px)';
        wishesWall.insertBefore(wishItem, wishesWall.firstChild);
        
        // 触发渐入动画
        requestAnimationFrame(() => {
            wishItem.style.opacity = '1';
            wishItem.style.transform = 'translateY(0)';
        });

        // 只有新添加的祝福才保存到本地存储
        if (shouldSave) {
            allWishes.push({ name, message, time });
            localStorage.setItem('wishes', JSON.stringify(allWishes));
        }

        checkWishesCount();
    }

    /**
     * 初始化祝福墙
     */
    function initWishesWall() {
        // 清空现有内容
        wishesWall.innerHTML = '';
        
        // 使用所有祝福数据，但不重复保存
        allWishes.forEach(wish => {
            addWishToWall(wish.name, wish.message, wish.time, false);
        });
    }

    /**
     * 检查祝福数量并处理滚动
     */
    function checkWishesCount() {
        const wishes = wishesWall.children;
        if (wishes.length > 4) {
            wishesWall.classList.add('scrolling');
        }
    }

    /**
     * 发送弹幕
     */
    function sendDanmaku(text) {
        const danmaku = document.createElement('div');
        danmaku.className = 'danmaku';
        danmaku.textContent = text;

        // 使用窗口高度而不是祝福墙高度
        const windowHeight = window.innerHeight;
        const top = 100 + Math.random() * (windowHeight - 100); // 上下留20px边距
        // const botton = 100 + Math.random() * (windowHeight - 100); // 上下留20px边距
        // 弹幕颜色数组
        const colors = [
            '#fff',    // 白色
            '#FFD700', // 金色
            '#FF69B4', // 粉色
            '#98FB98', // 浅绿
            '#87CEFA'  // 浅蓝
        ];

        // 弹幕动画时长
        const duration = 10 + Math.random() * 4;

        danmaku.style.cssText = `
            top: ${top}px;
            color: ${colors[Math.floor(Math.random() * colors.length)]};
            animation-duration: 15s;
            font-size: 1rem;
            left: ${window.innerWidth-500}px; /* 使用窗口宽度 */
        `;

        // 将弹幕容器移到 body 下
        if (!document.querySelector('.danmaku-container')) {
            const container = document.createElement('div');
            container.className = 'danmaku-container';
            document.body.appendChild(container);
        }

        document.querySelector('.danmaku-container').appendChild(danmaku);

        // 动画结束后移除弹幕
        danmaku.addEventListener('animationend', () => {
            danmaku.remove();
        });
    }

    // 修改提交祝福的逻辑，添加弹幕发送
    submitBtn.addEventListener('click', () => {
        const name = nameInput.value.trim();
        const message = messageInput.value.trim();

        if (name && message) {
            addWishToWall(name, message);
            
            // 发送弹幕
            sendDanmaku(`${name}: ${message}`);
            
            // 清空输入框
            nameInput.value = '';
            messageInput.value = '';

            // 提交反馈
            submitBtn.textContent = '发送成功 ✨';
            submitBtn.disabled = true;
            
            setTimeout(() => {
                submitBtn.textContent = '发送祝福 💝';
                submitBtn.disabled = false;
            }, 2000);
        }
    });

    // 弹幕发送间隔
    function startDanmakuLoop() {
        let index = 0;
        setInterval(() => {
            if (wishesWall.offsetParent !== null) {
                // 使用 allWishes 而不是 initialWishes
                const wish = allWishes[index];
                sendDanmaku(`${wish.name}: ${wish.message}`);
                index = (index + 1) % allWishes.length;
            }
        }, 3000);
    }

    // 开始弹幕循环
    startDanmakuLoop();

    // 初始化
    initWishesWall();
});

/**
 * 渲染愿望列表项
 * @param {Object} wish - 愿望数据
 * @returns {string} HTML字符串
 */
function renderWishItem(wish) {
    // 安全地获取用户名，如果不存在则显示默认值
    const userName = wish.user?.userName || '匿名用户';
    
    return `
        <div class="wish-item" data-id="${wish.id}">
            <div class="wish-content">${wish.content}</div>
            <div class="wish-info">
                <span class="wish-author">来自: ${userName}</span>
                <span class="wish-time">${formatTime(wish.createTime)}</span>
            </div>
            ${renderWishActions(wish)}
        </div>
    `;
}

/**
 * 渲染愿望操作按钮
 * @param {Object} wish - 愿望数据
 * @returns {string} HTML字符串
 */
function renderWishActions(wish) {
    // 获取当前登录用户
    const currentUser = store.state.currentUser;
    
    // 如果没有登录用户或愿望没有用户信息，只显示基本信息
    if (!currentUser || !wish.user) {
        return '';
    }

    // 检查是否是当前用户的愿望
    const isOwner = currentUser.id === wish.user.id;
    
    if (isOwner) {
        return `
            <div class="wish-actions">
                <button class="edit-btn" onclick="editWish(${wish.id})">编辑</button>
                <button class="delete-btn" onclick="deleteWish(${wish.id})">删除</button>
            </div>
        `;
    }
    
    return '';
} 